import Vue from 'vue'
import App from './App.vue'

Vue.config.productionTip = false

//vant组件库的使用
//1、下载：npm i vant@2
//注意：vant组件库需要下载2这个版本
//使用：有3种方法
//方法一：全部引入
// import Vant from "vant"
// import "vant/lib/index.css"
// Vue.use(Vant)  //注册使用
//方式二：手动按需引入组件
//需要用到那个组件就引用哪个组件
// import Button from 'vant/lib/button'
// import "vant/lib/button/style"
// Vue.use(Button)

// import icon from 'vant/lib/icon'
// import "vant/lib/icon/style"
// Vue.use(icon)

//方式三：自动按需引入组件
//优点：不需要手动引入样式
/**
 * 使用：
 *1、下载插件npm i babel-plugin-import -D
 * 2、在babel.config.js中添加配置（具体配置看文档  https://vant-contrib.gitee.io/vant/v2/#/zh-CN/quickstart）
 * 3、重启项目服务器 npm run serve
 * 4、看文档引入注册使用组件
 * 
 * 使用了自动按需引入之后，不能直接在全部引入，直接使用全部引入的时候会导致报错
 * 如何现在就想要使用全部引入的方式来使用vant组件库怎么办？
 * 需要把自动按需引入的内容删除（包括babel.config.js中的配置）
 * 如何重启项目即可
 * 
 */
import { Button, Icon, Dialog, Form, Field } from 'vant';
Vue.use(Button)
// import {Icon} from 'vant';
Vue.use(Icon)
// import { Dialog } from 'vant';
// import { Form } from 'vant';
// import { Field } from 'vant';
Vue.use(Form);
Vue.use(Field);

//全局注册
Vue.use(Dialog)

new Vue({
  render: h => h(App),
}).$mount('#app')
